<script setup lang="ts">
import XScroll from '@/components/XScroll.vue'
</script>

<template>
  <div class="container">
    <XScroll>
      <div class="card-list">
        <div class="card">
          <img src="./assets/t1.png" alt="" />
        </div>
        <div class="card">
          <img src="./assets/t2.png" alt="" />
        </div>
        <div class="card">
          <img src="./assets/t3.png" alt="" />
        </div>
        <div class="card">
          <img src="./assets/t4.png" alt="" />
        </div>
        <div class="card">
          <img src="./assets/t5.png" alt="" />
        </div>
        <div class="card">
          <img src="./assets/t6.png" alt="" />
        </div>
      </div>
    </XScroll>
  </div>
</template>

<style scoped>
div.container {
  margin: 10% auto;
  width: 100%;
  height: 327px;
}

.card-list {
  display: flex;
}

.card {
  padding: 0 10px;
}

img {
  width: 526px;
}
</style>
